@import "devui-theme/styles-var/devui-var.scss";
@import "./markdown.scss";

.mc-markdown-render {
  font-size: var(--devui-font-size, 14px);
  overflow-x: auto;
  &.mc-markdown-render-dark {
    color: #ced1db;
  }
  &.mc-markdown-render-light {
    color: #252b3a;
  }
}

@include deep() {
  .mc-think-block {
    color: $devui-aide-text;
    border-left: 1px solid $devui-line;
    padding-left: 8px;
    margin-bottom: 1rem;
  }

  .mc-typewriter-color {
    background-image: -webkit-linear-gradient(
      left,
      #191919,
      #5588f0,
      #e171ee,
      #f2c55c
    );
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .mc-typewriter-gradient {
    background: linear-gradient(to right, $devui-text, $devui-base-bg);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .mc-typewriter-cursor {
    font-weight: 900;
    animation: typewriter 800ms linear 0s infinite;
  }
}

@keyframes typewriter {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
